<div class="flexVCent">
  <h2 class="h4 required flexExpand"><%= ob.polyT('purchase.shippingTitle') %></h2>
  <% if (ob.userAddresses.length) { %>
    <a class="clrTEm txU tx5b js-newAddress"><%= ob.polyT('purchase.newAddress') %></a>
  <% } %>
</div>
<div class="row">
  <% if (ob.userAddresses.length) { %>
  <select id="shippingAddress">
    <% ob.userAddresses.forEach((a, i) => { %>
    <option value="<%= i %>" <% if (ob.selectedAddressIndex === i) print('selected') %>>
      <% const addr = [];
         addr.push(a.name);
         if (a.company) addr.push(a.company);
         if (a.addressLineOne) addr.push(a.addressLineOne);
         if (a.addressLineTwo) addr.push(a.addressLineTwo);
         if (a.city) addr.push(a.city);
         const state = a.state || '';
         const code = a.postalCode || '';
         const stateCode = `${state ? `${state} ` : ''}${code}`;
         if (stateCode) addr.push(stateCode);
         print(addr.join(', '));
      %>
    </option>
    <% }); %>
  </select>
  <% } else { %>
    <div class="padGi txCtr">
      <div class="txB row">
        <%= ob.polyT('purchase.noAddresses') %>
      </div>
      <button class="btn clrP clrBr js-newAddress">
        <%= ob.polyT('purchase.newAddress') %>
      </button>
    </div>
  <% } %>
</div>
<div class="js-shippingOptionsWrapper"></div>
